<template>
    <div class="footer">
      <index-login @complete="complete" v-if="isNeedLogin"></index-login>
      <div class="dlAll">
        <dl @click="toIndex">
          <dt><img src="/static/images/goods/toindex.png"></dt>
          <dd>首页</dd>
        </dl>
        <dl>
          <dt @click="clickCollect">
            <img v-if="isCollect" src="/static/images/goods/collect-active.png">
            <img v-else src="/static/images/goods/collect.png">
          </dt>
          <dd>收藏</dd>
        </dl>
      </div>
      <ul>
        <li  v-if="isShowCar && isCancel == false" @click="addToCart('addShopCar')">加入购物车</li>
        <li  v-if="isShowBuy" @click="addToCart('normal')">闪购</li>
        <li  v-if="isShowRent" @click="addToCart('normal')">租赁</li>
        <li  v-if="isShowDo" @click="addToCart('normal')">我要定制</li>
        <!-- <li @click="addToCart('share')">分享购</li> -->
      </ul>
      <confirm :isShowConfirm="confirmShow" ref="confirm" @isLogin="isLogin" :virtualStock="virtualStock" :btnType="selectType" :isFlashBuy="isFlashBuy" :isAddShopCar="isAddShopCar"  @cancel="cancel"></confirm>
    </div>
</template>

<script>
  import indexLogin from '@/components/dialog/index-login'
  import confirm from './indetail-confirm.vue'
  export default {
    components: {
      confirm,indexLogin
    },
    data () {
      return {
        selectType: '',//选择的类型
        virtualStock: 0,
        isFlashBuy:true, //是闪购
        isAddShopCar:true, //加入购物车
        isShowCar:true,
        isShowBuy:true,
        isShowRent:false,
        isShowDo:false,
        isNeedLogin:false, //是否弹出授权框
        flag:false,
      }
    }, 
    props: {
      selectId:{
        type:Number,
      },
      isCollect: { 
        type: Boolean,
      },
      ids:{
        type: Number,
      },
      confirmShow: { 
        type: Boolean,
        default: false,
      },
      isCancel:{
        type:Boolean,
      }
    },
    onLoad(){
      let a = wx.getStorageSync('selectIdNum')
      if(a== 10){
        this.isShowCar = false
        this.isShowBuy = false
        this.isShowRent = true
        this.isShowDo = false
      }else if(a == 3){
        this.isShowCar = false
        this.isShowBuy = false
        this.isShowRent = false
        this.isShowDo = true
      }else{
        this.isShowCar = true
        this.isShowBuy = true
        this.isShowRent = false
        this.isShowDo = false
      }
      wx.setStorageSync('type', "normal") //设置缓存
    },
    
    methods: {
      isLogin(a){
        this.flag = a
      },
      complete(){
        this.$refs.confirm.updateUserInfo();
      },
      toIndex () {
        const url = '../index/main';
        wx.switchTab({ url })
      },
      clickCollect(){
        if(!this.isCollect){
          this.$http.get(`products/fav/${this.ids}`).then((res)=>{
            if(res.data.code == 0) {
              this.isCollect = true 
              }else if(res.data.code == 3){
              this.isNeedLogin = true
              }
           })
          // this.$http.get(`products/fav/${this.ids}`).then((res)=>{
          // console.log('shoucang',data)
          //this.wxAlert("收藏成功")
        }else{
          this.isCollect = false
          this.$http.get(`products/fav/${this.ids}`).then((res)=>{})
          //this.wxAlert("取消成功")
        }
      },
      addToCart (type){
        console.log("商品详情底部弹框flag",this.flag)
        if(this.flag){
          this.isNeedLogin = true
        }else{
          // this.isNeedLogin = false
          // this.flag = false
          this.virtualStock = wx.getStorageSync('virtualStock')
          this.confirmShow = true;
          this.$emit("isScroll",true)
          this.selectType= type;
        }
      },
      cancel(){
        this.confirmShow = false;
        this.$emit("isScroll",false)
      },
      wxAlert(txt){
        wx.showToast({
          title: txt,
          icon: "none",
          duration: 2000,
          mask: true
        })
      }
    },
  }
</script>

<style scoped>
.footer{
  position: fixed;
  bottom: 0;
  width: 100%;
  height: 120rpx;
  display: flex;
  background: #fff;
}
.footer .dlAll{
  display: flex; 
  align-items: center;
  font-size: 22rpx;
  color: #9e9e9e;
  flex: 1;
  margin: 0 30rpx;
}
.footer .dlAll dl{
  flex: 1;
  text-align: center
}
.footer .dlAll dl img{
  width: 36rpx;
  height: 36rpx;
}
.footer ul{
  display: flex;
  margin-right: 20rpx;
  padding-top: 20rpx;
}
.footer ul li{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 230rpx;
  height: 80rpx;
  color: #fff;
  font-size: 32rpx;
}
.footer ul li:first-child{
  background: #e1c7d2;
  border-radius: 6rpx 0 0 6rpx;
  margin-right: 10rpx;
}
.footer ul li:last-child{
  background: #aad1d6;
  border-radius: 0 6rpx 6rpx 0;
}

</style>
